<template>
  <div>

    <div class="pie-box">
      <query-date
        ref="queryTime"
        :date1="date1"
        @queryTimeData="dataQuery"/>
      <common-total-count ref="totalDom" :obj-data="objData" />
      <div class="include">
        <pie-map ref="pieDom" :obj="obj1" :formatter="formatter" :is-inner="isInner" :data-source="showDatas" :title="pieTitle"/>
        <pie-map v-show="isShowPiePrivoceDom" ref="piePrivoceDom" :obj="obj2" :formatter="formatter" :data-source=" provinceDataShow" :title="comparisonPieTitle"/>
        <circuit-bar ref="circuitBarDom" :obj="circuitBar"/>
        <circuit-bar ref="circuitStateBarDom" :obj="circuitStateBar"/>
        <div class="container">
          <line-map
            ref="lineDom"
            :dom-obj="weekLine"
            :x-axis-data="days"
            :title="dayTitle"
            :unit="unit"/>
          <pic-bar ref="vBarDom" :dom-obj="picVBar" :unit="unit"/>
          <mask-loading
            v-show="isShowMask"
            :msg="msg"
            :num="num"
            :width="width"/>
        </div>
      </div>
    </div>
  </div>
</template>
<script>
import pieMap from '@/components/pie/pie'
import lineMap from '@/components/line/line'
import picBar from '@/components/bar/verticalBar'
import queryDate from '@/components/queryDate/queryDate'
import common from '@/assets/js/common.js'
import maskLoading from '@/components/mask/mask'
import commonTotalCount from '@/components/CommonTotalCount/CommonTotalCount'
import circuitBar from '@/components/bar/bar'
export default {
  components: {
    pieMap,
    lineMap,
    queryDate,
    picBar,
    maskLoading,
    commonTotalCount,
    circuitBar
  },
  data () {
    return {
      obj1: 'runningWater',
      obj2: 'comparisonPieDom',
      weekLine: 'weekLine',
      picVBar: 'picVBar',
      days: [],
      dayTitle: '',
      pieTitle: '',
      comparisonPieTitle: '',
      vBarTitle: '',
      isInner: 'inner',
      formatter: '',
      isShowOther: true,
      personMoney: '',
      totalMoney: '',
      unit: '万元',
      manageTitle: '',
      areaName: '',
      userType: '',
      date1: '昨日',
      barUnit: '',
      amount: '',
      units: '条',
      allAmount: '',
      AllTitle: '全部',
      isShowAll: true,
      msg: '加载中...',
      num: 1,
      isShowMask: false,
      fieldType: 'count',
      width: '13%',
      circuitBar: 'circuitBar',
      circuitStateBar: 'circuitStateBar',
      circuitStateBarTitle: '',
      circuitBarTitle: '',
      // 省区经理才显示第二个饼图
      isShowPiePrivoceDom: true,
      objData: {},
      provinceDataShow: [],
      showDatas: []
    }
  },
  mounted () {
    common.isUserType(this, '条')
    this.$nextTick(() => {
      common.homeRequest(1, null, null, this, 'getLine')
    })
  },
  methods: {
    dataQuery (index) {
      let getLine = JSON.parse(sessionStorage.getItem('getHomeData'))
      common.clickDate(this, index, 'getLine')
      this.runningWaterData(getLine.resultData, this.pieTitle)
      common.dataQueryCommon(index, this, getLine.resultData, this.dayTitle, '条', this.userType, this.pieTitle, this.fieldType, 'getLine')
    },
    firstTimeInit (userType, that, type) {
      let getLine = JSON.parse(sessionStorage.getItem('getHomeData'))
      common.homeShowDate(getLine.resultData, userType, that, type)
    },
    commonInit (dataSource, date, userType, that, num) {
      let getRole = JSON.parse(sessionStorage.getItem('getRole'))
      let changeName = ''
      if (getRole.userType === 1) {
        changeName = '占'
      } else {
        changeName = '对'
      }
      this.pieTitle = date + getRole.areaName + '线路总数' + changeName + '比'
      this.comparisonPieTitle = date + getRole.areaName + '线路总数占比'
      this.runningWaterData(dataSource, this.pieTitle, date)
      this.commonData('昨日')
      if (num === 0) {
        this.vBarTitle = '近7天' + getRole.areaName + '线路量'
        common.isNull(dataSource, that, '近7天' + getRole.areaName + '线路趋势', '条', userType, this.pieTitle)
      } else {
        this.commonData(date)
        common.isNull(dataSource, that, date + getRole.areaName + '线路趋势', '条', userType, this.pieTitle)
        this.vBarTitle = date + getRole.areaName + '线路量'
      }
    },
    runningWaterData (data, title, date) {
    // userType为1代表是最高全限看全国
      let showDatas = []
      let getRole = JSON.parse(sessionStorage.getItem('getRole'))
      let dataSource = data.resultIndexGroupByRegion
      this.circuitBarTitle = date + getRole.areaName + '前六名省份'
      this.circuitStateBarTitle = date + getRole.areaName + '线路状态'
      showDatas = common.hotPicPieData(dataSource, this, 'name', 'value')
      this.amount = common.formatNum(dataSource[0].Regioncount)
      // 省区经理饼图对比
      let provinceData = data.resultIndexGroupByArea
      let provinceDataShow = []
      if (provinceData.length > 0) {
        provinceDataShow = common.hotPicPieData(provinceData, this, 'name', 'value')
        this.isShowPiePrivoceDom = true
      } else {
        this.isShowPiePrivoceDom = false
      }
      this.showDatas = showDatas
      this.provinceDataShow = provinceDataShow
      // this.$nextTick(() => {
      //   this.$refs.pieDom.showData(showDatas, this.pieTitle)
      //   this.$refs.piePrivoceDom.showData(provinceDataShow, this.pieTitle)
      // })
    },
    commonData (date) {
      let getRole = JSON.parse(sessionStorage.getItem('getRole'))
      let getHomeData = JSON.parse(sessionStorage.getItem('getHomeData'))
      let totalCountData = getHomeData.resultData.navigationColumn
      this.allAmount = totalCountData.totalCount
      this.amount = totalCountData.timeCount
      this.priorPeriod = totalCountData.ringRatioCount
      this.rightTitle = date + getRole.areaName + '线路数'
      this.leftTitle = getRole.areaName + '线路数'
      this.objData = {
        leftTitle: this.leftTitle,
        rightTitle: this.rightTitle,
        allAmount: this.allAmount,
        amount: this.amount,
        unit: '个',
        priorPeriod: this.priorPeriod
      }
      // this.$refs.totalDom.changeTitle(totalObj)
      // 前6名
      this.passengerBarTitle = date + getRole.areaName + '线路数前列排名'
      let resultLineProvinceData = getHomeData.resultData.resultLineProvinceData
      let yData = []
      let payDealData = ''
      payDealData = common.maxValue(resultLineProvinceData, this, 'value', '个')
      if (resultLineProvinceData && resultLineProvinceData.length > 0) {
        for (let k = 0; k < 6 && k < resultLineProvinceData.length; k++) {
          if (resultLineProvinceData[k].provinceName === 'undefined') {
            break
          } else {
            yData.push(resultLineProvinceData[k].name)
          }
        }
      }
      let barXData = payDealData.yaisData.splice(0, 6)
      // 线路数状态
      let resultLineStateData = getHomeData.resultData.resultLineOrderStatus
      let stateYdata = []
      for (let k in resultLineStateData) {
        stateYdata.push(resultLineStateData[k].name)
      }
      let backDataState = common.maxValue(resultLineStateData, this, 'value', '条')
      this.$refs.circuitBarDom.barData(yData.reverse(), barXData.reverse(), this.passengerBarTitle, backDataState.unit)
      this.$refs.circuitStateBarDom.barData(stateYdata.reverse(), backDataState.yaisData.reverse(), this.circuitStateBarTitle, backDataState.unit)
    }
  }
}

</script>
<style lang="scss" scoped>
.container {
  position: relative;
}

</style>
